<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Manage | 菜单管理</title>
    <!-- Tell the browser to be responsive to screen width -->
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
    <!-- Pace -->
    <link rel="stylesheet" href="../../plugins/AdminLTE/plugins/pace-master/themes/blue/pace-theme-flash.css">
    <script type="text/javascript" src="../../plugins/AdminLTE/plugins/pace-master/pace.min.js"></script>
    <!-- Bootstrap 3.3.6 -->
    <link rel="stylesheet" href="../../plugins/AdminLTE/bootstrap/css/bootstrap.min.css">
    <!-- Font Awesome -->
    <link rel="stylesheet" href="../../plugins/AdminLTE/dist/css/font-awesome.min.css">
    <!-- Ionicons -->
    <link rel="stylesheet" href="../../plugins/AdminLTE/dist/css/ionicons.min.css">
    <!-- bootstrap table -->
    <link rel="stylesheet" href="../../plugins/AdminLTE/plugins/bootstrap-table/bootstrap-table.css">
    <!-- treeview -->
    <link rel="stylesheet" href="../../plugins/treeview/bootstrap-treeview.min.css">
    <!-- Theme style -->
    <link rel="stylesheet" href="../../plugins/AdminLTE/dist/css/AdminLTE.min.css">
    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<body class="hold-transition skin-blue sidebar-mini">
<section class="content-header">
    <h1>
        菜单管理
    </h1>
    <ol class="breadcrumb">
        <li><i class="fa fa-home"></i> Home</li>
        <li>系统设置</li>
        <li>菜单管理</li>
    </ol>
</section>

<section class="content">
    <div class="btn-group" id="toolbar">
        <button onclick="AddMenu()" type="button" class="btn btn-sm btn-primary"><i class="fa fa-plus"></i>添加</button>
    </div>
    <table id="menu_data" class="table-bordered table-condensed"></table>
</section>

<div id="menuModal" class="modal fade" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title title-name"></h4>
            </div>
            <div class="modal-body col-xs-12">
                <form id="form_menu" onsubmit="return false" style="line-height: 40px;">
                    <input style="display: none" type="text" name="id">
                    <input style="display: none" type="text" name="isChildren" value="false">
                    <div class="form-group col-xs-12 col-md-6">
                        <div class="input-group">
                            <div class="input-group-addon">上级菜单</div>
                            <input name="parentName" readonly type="text" class="form-control">
                            <input style="display: none" name="parentId" type="text" class="form-control">
                            <div class="input-group-addon btn" onclick="clean()"><i class="fa fa-remove"></i></div>
                            <div data-toggle="modal" data-target="#menuTreeModal" class="input-group-addon btn"><i
                                    class="fa fa-search"></i></div>
                        </div>
                    </div>
                    <div class="form-group col-xs-12 col-md-6">
                        <div class="input-group">
                            <div class="input-group-addon">名称<i class="text-red">*</i></div>
                            <input name="name" type="text" class="form-control">
                        </div>
                    </div>
                    <div class="form-group col-xs-12 col-md-12">
                        <div class="input-group">
                            <div class="input-group-addon">地址</div>
                            <input name="url" type="text" class="form-control">
                        </div>
                    </div>
                    <div class="form-group col-xs-12 col-md-6">
                        <div class="input-group">
                            <div class="input-group-addon">图标</div>
                            <input name="icon" type="text" class="form-control">
                        </div>
                    </div>
                    <div class="form-group col-xs-12 col-md-6">
                        <div class="input-group">
                            <div class="input-group-addon">排序<i class="text-red">*</i></div>
                            <input name="sort" value="0" type="number" max="999999" class="form-control">
                        </div>
                    </div>
                    <div class="form-group col-xs-12">
                        <div class="input-group">
                            <div class="input-group-addon">描述</div>
                            <textarea name="description" class="form-control" style="height: 95px;"></textarea>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <div class="col-xs-12">
                    <button onclick="SubmitForm()" type="button" class="btn btn-info">提交</button>
                </div>
            </div>
        </div>
    </div>
</div>

<div id="menuTreeModal" class="modal fade">
    <div class="modal-dialog" style="width: 260px;">
        <div class="modal-content">
            <div class="modal-header">
                <div class="pull-right">
                    <button type="button" class="btn btn-xs btn-primary" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">确认</span></button>
                </div>
                <h4 class="modal-title">选择父级菜单</h4>
            </div>
            <div class="modal-body" style="width: 260px; max-height: 310px; overflow-y: scroll">
                <div id="menuTree"></div>
            </div>
        </div>
    </div>
</div>

<!-- jQuery 2.2.3 -->
<script src="../../plugins/AdminLTE/plugins/jQuery/jquery-2.2.3.min.js"></script>
<!-- jQuery UI -->
<script src="../../plugins/AdminLTE/plugins/jQueryUI/jquery-ui.min.js"></script>
<!-- Bootstrap 3.3.6 -->
<script src="../../plugins/AdminLTE/bootstrap/js/bootstrap.min.js"></script>
<!-- FastClick -->
<script src="../../plugins/AdminLTE/plugins/fastclick/fastclick.js"></script>
<!-- bootstrap table -->
<script src="../../plugins/AdminLTE/plugins/bootstrap-table/bootstrap-table.js"></script>
<script src="../../plugins/AdminLTE/plugins/bootstrap-table/bootstrap-table-zh-CN.min.js"></script>
<!-- treeview -->
<script src="../../plugins/treeview/bootstrap-treeview.min.js"></script>
<!-- AdminLTE App -->
<script src="../../plugins/AdminLTE/dist/js/app.min.js"></script>
<script src="../../statics/js/menu.js"></script>
</body>
</html>
